{% extends "manage/manage_layout.html" %}

{% block body %}
<div id="layout">
    <!-- Menu toggle -->
    <a href="#menu" id="menuLink" class="menu-link">
        <!-- Hamburger icon -->
        <span></span>
    </a>

    <div id="menu">
        <div class="pure-menu">
            <a class="pure-menu-heading" href="/manage/">管理后台</a>

            <ul class="pure-menu-list">
                <li class="pure-menu-item"><a href="/" class="pure-menu-link">返回首页</a></li>
                <li class="pure-menu-item"><a href="/profile/" class="pure-menu-link">个人首页</a></li>
                <li class="menu-item-divided pure-menu-selected">
                    <a href="/manage/" class="pure-menu-link">内容管理</a>
                </li>
                <li class="pure-menu-item"><a href="/manage/category/" class="pure-menu-link">分类管理</a></li>
                <li class="pure-menu-item"><a href="/manage/volume/" class="pure-menu-link">期数管理</a></li>
                <li class="pure-menu-item"><a href="/sign/out/" class="pure-menu-link">注销</a></li>
            </ul>
        </div>
    </div>

    <div id="main">
        <div class="header">
            <h1>{{ page_title }}</h1>
            <h2>兴趣是最好的老师，Hello GitHub 就是帮你找到编程的兴趣。</h2>
        </div>

        <div class="content">
            {#  搜索项目 #}
            <form class="pure-form">
                {# 选择方式 #}
                <fieldset>
                    <label for="type">选择查看方式</label>
                    <select id="type" name="type">
                        <option value="volume">vol.</option>
                        <option value="category">category</option>
                    </select>
                    <select id="subset-volume" name="subset-volume">
                        {% for volume in volumes %}
                            <option value="{{ volume.id }}"> {{ volume.name }}</option>
                        {% endfor %}
                    </select>
                    <select id="subset-category" name="subset-category" hidden="hidden">
                        {% for category in categorys %}
                            <option value="{{ category.id }}"> {{ category.name }} </option>
                        {% endfor %}
                    </select>
                    <button id="type-submit" type="button" class="pure-button pure-button-primary">Go</button>
                    OR
                    {# 搜索框 #}
                    <input id="search-project-url" type="text" class="pure-input-rounded" placeholder="请输入 project_url">
                    <button id="search-submit" type="button" class="pure-button">Search</button>
                    &nbsp;
                    &nbsp;
                    {# 增加内容 #}
                    <button id="create-project-button" type="button" class="pure-button button-success">+</button>

                </fieldset>
            </form>

            {# 请求结果展示 #}
            <div class="pure-g-1" id="result"></div>
        </div>
    </div>
</div>
{% endblock %}

{% block js %}
{{ super() }}
<script src="{{ url_for('static', filename='js/manage_content.js')}}"></script>
{% endblock %}